<template>
  <div class="app-container addProjectApp">
      <div class="type">
          <el-breadcrumb separator-class="el-icon-arrow-right">
                <!-- <el-breadcrumb-item :to="{path:'/entry',name:'entry',params:{courseId:courseId}, query:{anchor:anchor,type:1}}">课程建设</el-breadcrumb-item> -->
                <el-breadcrumb-item :to="{path:'/project/projectList'}" style="font-size: 16px;color: #262626;">项目管理</el-breadcrumb-item>
                <el-breadcrumb-item :to="{path:'/project/shopList'}" style="font-size: 12px;color: #777777 !important;line-height:52px">商品列表</el-breadcrumb-item>
                <el-breadcrumb-item style="font-size: 12px;color: #777777 !important;line-height:52px">{{id==0?'新建商品':'编辑商品'}}</el-breadcrumb-item>
            </el-breadcrumb>
       </div>
       <div class="header">
            <!-- <h3 >{{id==0?'新建商品':'编辑商品'}}</h3> -->
            <div class="parts">
               <span>第一步：填写基本信息</span>
               <div class="border"></div>
            </div>
            <div class="nav">
                <div class="navList clearfloat">
                  <!-- <h4 class="h5">所属项目</h4> -->
                  <h4 class="h5 clearfloat">
                    <img src="../../assets/img/xiangmuming.png" style="float:left;"/>
                    <span style="float:left;">所属项目</span>
                  </h4>
                  <!-- <el-input v-model="projectName" class="input" placeholder="请填写项目名称，4~20个字，必填项"></el-input> -->
                  <el-select v-model="projectName" filterable class="input projectNameSelectInput"  popper-class="projectNameSelect" placeholder="请选择项目">
                        <el-option
                          v-for="item in options"
                          :key="item.id"
                          :label="item.name"
                          :value="item.id">
                        </el-option>
                  </el-select>
                  <div class="uploadFontFont">
                      <div class="xing">*</div>
                  </div>
                </div>
                <div class="navList clearfloat">
                  <!-- <h4 class="h5">商品标题</h4> -->
                  <h4 class="h5 clearfloat">
                    <img src="../../assets/img/biaoti.png" style="float:left;"/>
                    <span style="float:left;">商品标题</span>
                  </h4>
                  <el-input v-model="projectTitle" class="input" placeholder="请输入商品标题，必填项，最多20个字" ref="projectTitleRef" @blur="projectTitleChange"></el-input>
                  <div class="uploadFontFont">
                      <div class="xing">*</div>
                  </div>
                </div>
                <div class="navList clearfloat">
                  <!-- <h4 class="h5">商品副标题</h4> -->
                  <h4 class="h5 clearfloat">
                    <img src="../../assets/img/xiangmu.png" style="float:left;"/>
                    <span style="float:left;">副标题</span>
                  </h4>
                  <el-input v-model="projectDetail" @blur="projectDetailChange" ref="projectDetailRef" type="textarea" class="input textareaShop" placeholder="请输入商品副标题，20~150字，必填项，可以简单介绍商品优势和亮点"></el-input>
                  <div class="uploadFontFont">
                      <div class="xing">*</div>
                  </div>
                </div>
            </div>
            <div class="parts partsSec">
              <span>第二步：商品描述</span>
              <div class="border"></div>
            </div>
            <div class="nav">
              <div class="navList clearfloat">
                  <!-- <h4 class="h5">商品图片</h4> -->
                  <h4 class="h5 clearfloat">
                    <img src="../../assets/img/zhutu.png" style="float:left;"/>
                    <span style="float:left;">商品图片</span>
                  </h4>
                  <div class="uploadDetail">
                    <!-- <div class="upload">+ 上传</div> -->
                    <Upload :limit='10' :height="548" @uploadHandler='uploadChange' :dataOther='fileOtherPic'></Upload> 
                    <!-- <p>支持jpg,png格式，每张图不超过1M，可上传10张图片</p> -->
                  </div>
                </div>
                <div class="navList clearfloat">
                  <!-- <h4 class="h5">行程路线</h4> -->
                  <h4 class="h5 clearfloat">
                    <img src="../../assets/img/xingcheng.png" style="float:left;"/>
                    <span style="float:left;">行程路线</span>
                  </h4>
                  <tinymce v-model="content" class="input" style="width:80%" :height="100" />
                  <div class="uploadFontFont">
                      <div class="xing">*</div>
                  </div>
                   <!-- <markdown-editor ref="markdownEditor" class="input" style="width:70%" v-model="content" :options="{hideModeSwitch:true,previewStyle:'tab'}" height="150px" /> -->
                </div>
                <div class="navList clearfloat">
                  <!-- <h4 class="h5">图文描述</h4> -->
                  <h4 class="h5 clearfloat">
                    <img src="../../assets/img/tuwen.png" style="float:left;"/>
                    <span style="float:left;">图文描述</span>
                  </h4>
                  <tinymce v-model="content2" class="input" style="width:80%" :height="100" />
                  <div class="uploadFontFont">
                      <div class="xing">*</div>
                  </div>
                   <!-- <markdown-editor ref="markdownEditor" class="input" style="width:70%" v-model="content2" :options="{hideModeSwitch:true,previewStyle:'tab'}" height="150px" /> -->
                </div>
                <div class="navList clearfloat">
                  <!-- <h4 class="h5">购买须知</h4> -->
                  <h4 class="h5 clearfloat">
                    <img src="../../assets/img/car.png" style="float:left;"/>
                    <span style="float:left;">购买须知</span>
                  </h4>
                  <el-input v-model="playDetail" type="textarea" class="input textareaShop" placeholder="必填项，仅支持文字"></el-input>
                  <div class="uploadFontFont">
                      <div class="xing">*</div>
                  </div>
                </div> 
            </div>
            <div class="parts partsSec">
              <span>第三步：商品可用期与价格/优惠</span>
              <div class="border"></div>
            </div>
            <div class="nav">
                <div class="navList clearfloat">
                  <!-- <h4 class="h5">可出行日期</h4> -->
                  <h4 class="h5 clearfloat">
                    <img src="../../assets/img/riqiShop.png" style="float:left;"/>
                    <span style="float:left;">可出行日期</span>
                  </h4>
                  <!-- <el-input v-model="projectPhone" type="number" class="input numberShop" ref="projectPhone" placeholder="请输入，必填项，必须是正整数" ></el-input> -->
                  <el-date-picker
                    class="input dateShop"
                    v-model="shopDate"
                    type="daterange"
                    range-separator="~"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期">
                   </el-date-picker>
                   <div class="uploadFontFont">
                      <div class="xing">*</div>
                  </div>
                </div>

                <div class="navList clearfloat">
                  <h4 class="h5 clearfloat">
                    <span style="float:left;">出行天数</span>
                  </h4>
                  <div class="">
                       <input v-model="days"  class="input el-input__inner input numberShop numberShopDate" ref="days" placeholder="请输入" @keydown="keydown" @keyup="proving3()" @blur="oninput3()" />
                       <span class="numberShopDateFont">天</span>
                       <input v-model="nights"  class="input el-input__inner input numberShop numberShopDate" ref="nights" placeholder="请输入" @keydown="keydown" @keyup="proving4()" @blur="oninput4()" />
                       <span class="numberShopDateFont">晚</span>
                  </div>
                  <div class="uploadFontFont">
                     <div class="xing">*</div>  
                  </div>
                </div>

                <div class="navList clearfloat">
                  <h4 class="h5 clearfloat">
                    <svg width="14px" height="14px" style="float:left;" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
                        <desc>Created with Sketch.</desc>
                        <g id="后台确认方案" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                            <g id="6.商品新建复制-2" transform="translate(-227.000000, -298.000000)" fill="#262626" fill-rule="nonzero">
                                <path d="M231.918822,299.871818 L238.027328,301.760657 L239.510318,300.787814 L233.831342,299.079252 L233.796508,299.074668 C233.652945,299.025784 233.495079,299.04325 233.365674,299.122335 L233.330841,299.135168 L231.918822,299.871818 Z M230.763186,300.474713 L228.610393,301.597825 L235.2823,303.5614 L237.032489,302.413273 L230.763186,300.474713 Z M239.950099,301.595483 L235.837927,304.294793 L235.837927,310.724599 L235.876427,310.686098 L235.901177,310.681515 L239.656765,307.411761 L239.675098,307.387928 C239.816992,307.249251 239.908873,307.067422 239.936349,306.870927 L239.950099,306.828761 L239.950099,306.757261 L239.950097,306.741688 C239.950097,306.7313 239.950099,306.720911 239.950104,306.710522 L239.950099,306.727011 L239.950099,301.595483 Z M234.92126,310.759445 L234.92126,304.410591 L228.043502,302.38702 L228.043502,308.072679 L228.052668,308.164346 C228.073752,308.360512 228.206668,308.521846 228.390002,308.582346 L228.533919,308.629096 L228.542169,308.641013 L234.92126,310.759445 Z M240.866767,306.710511 L240.8686,306.742594 L240.866767,306.774677 L240.866767,307.015761 L240.8301,307.087261 C240.760523,307.452718 240.579994,307.787847 240.313099,308.047012 L240.285599,308.080012 L236.319178,311.533099 L236.313678,311.534016 C236.075465,311.725713 235.778861,311.830187 235.473094,311.8301 C235.360343,311.8301 235.253093,311.814516 235.143093,311.784266 L235.11376,311.789766 L227.970168,309.418347 L227.953668,309.39543 C227.549001,309.209065 227.256323,308.842283 227.164417,308.406346 L227.126834,308.359596 L227.126834,301.953922 L227.145167,301.921838 C227.195584,301.570755 227.389917,301.260004 227.681418,301.060171 L227.686918,301.068421 L227.739168,301.022587 L227.711668,301.040004 C227.777668,300.996004 227.848251,300.959337 227.880335,300.948337 L232.908257,298.326667 L232.921091,298.321167 C233.266455,298.12304 233.678977,298.078497 234.058675,298.198334 L234.089842,298.201084 L240.245266,300.053669 L240.268182,300.081169 C240.623849,300.226003 240.8686,300.568837 240.866766,300.97217 L240.866766,306.71051 Z M229.26817,305.458342 C229.02956,305.373839 228.904632,305.111905 228.989136,304.873295 C229.0724,304.638185 229.32838,304.512815 229.56517,304.591175 L232.097923,305.458342 C232.336533,305.542845 232.461461,305.80478 232.376957,306.04339 C232.293693,306.278499 232.037712,306.403869 231.800923,306.32551 L229.26817,305.458342 Z" id="kucun"></path>
                            </g>
                        </g>
                    </svg>
                    <span style="float:left;">单天库存</span>
                  </h4>
                  <input v-model="inventory"  class="input el-input__inner input numberShop " ref="inventory" placeholder="指单天可支持下单的数量，必填项，必须是正整数" @keydown="keydown" @keyup="proving2()" @blur="oninput2()" />
                  <div class="uploadFontFont" style="width:20px;">
                      <svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
                          <title>指用户选定出行日期后，当天可接待的最大人数</title>
                          <desc>Created with Sketch.</desc>
                          <g id="后台确认方案" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                              <g id="6.商品新建复制-2" transform="translate(-942.000000, -295.000000)" fill="#FC612A" fill-rule="nonzero">
                                  <path d="M952,315 C957.523008,315 962,310.523008 962,305 C962,299.476992 957.523008,295 952,295 C946.476992,295 942,299.476992 942,305 C942,310.523008 946.476992,315 952,315 Z M952,313.571 L952,313.571 C947.266094,313.622133 943.387051,309.826 943.335918,305.092074 C943.284785,300.358168 947.080918,296.479125 951.814844,296.427992 C951.876549,296.427326 951.938259,296.427326 951.999964,296.427992 L951.999964,296.427992 C956.73387,296.479124 960.530022,300.358167 960.478889,305.092074 C960.428536,309.753851 956.661702,313.520667 951.999925,313.570999 L952,313.571 Z M951.647,300.000004 L951.647,300.000004 C951.25267,299.999474 950.93257,300.318713 950.932041,300.713043 C950.932024,300.725703 950.932344,300.73836 950.933,300.751003 L951.226,306.465007 C951.246,306.845007 951.559,307.143007 951.939,307.143007 L952.061,307.143007 C952.441,307.143007 952.755,306.845007 952.774,306.465007 L953.067,300.751003 L953.067,300.751002 C953.087434,300.357202 952.78476,300.021397 952.390959,300.000961 C952.378649,300.000323 952.366325,300.000003 952.353999,300.000002 L951.646999,300.000002 L951.647,300.000004 Z M952,310.000004 L952,310.000004 C952.591773,310.000004 953.0715,309.520277 953.0715,308.928504 C953.0715,308.33673 952.591773,307.857004 952,307.857004 L952,307.857004 C951.408227,307.857004 950.9285,308.33673 950.9285,308.928504 C950.9285,309.520277 951.408227,310.000004 952,310.000004 L952,310.000004 Z" id="tishi"></path>
                              </g>
                          </g>
                      </svg>
                  </div>
                  <div class="uploadFontFont" style="float:left;">
                      <div class="xing">*</div>  
                  </div>
                </div>

                <div class="navList clearfloat">
                  <!-- <h4 class="h5">商品价格</h4> -->
                  <h4 class="h5 clearfloat">
                    <img src="../../assets/img/priceShop.png" style="float:left;"/>
                    <span style="float:left;">商品价格</span>
                  </h4>
                  <input v-model="projectPhone"  class="input el-input__inner input numberShop " ref="projectPhone" placeholder="请输入，必填项，必须是正整数" @keydown="keydown" @keyup="proving1()" @blur="oninput1()" />
                  <p class="numberP">元/人</p>
                  <div class="uploadFontFont">
                      <div class="xing">*</div>  
                  </div>
                </div>
                
                <div class="navList clearfloat">
                  <!-- <h4 class="h5">优惠</h4> -->
                  <h4 class="h5 clearfloat">
                    <img src="../../assets/img/youhuiShop.png" style="float:left;"/>
                    <span style="float:left;">优惠</span>
                  </h4>
                  <div class="checkDetail clearfloat">
                    <div class="checkListAll clearfloat">
                      <el-checkbox-group v-model="checkListBase" class="checkListShop">
                        <!-- checkListBaseList -->
                        <el-checkbox :value="item.code" :label="item.desc" v-for="(item,index) in checkListBaseList" v-if="index==0" :key=index></el-checkbox>
                      </el-checkbox-group>
                    </div>
                  </div>
                </div>
            </div>
            <div class="sumitAdd clearfloat">
              <!-- <router-link :to="{path:'/project/shopList'}"> -->
                  
              <!-- </router-link> -->
              <div class="sumitBtn setData" @click="addProjectData">提交</div>
              <div class="sumitBtn" @click="sumitBtnFalse">取消</div>
            </div>
       </div>
       <el-dialog
        title="提示"
        :visible.sync="dialogVisible"
        width="370px"
      >
        <span>是否确认离开，所做的修改将不被保存</span>
        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="sureBtn()">确 定</el-button>
        </span>
      </el-dialog>
  </div>
</template>

<script>
import api from "@/fetch/url";
import {FormatDate} from '@/utils/index.js'
import Upload from '@/components/upload';
import Tinymce from '@/components/Tinymce'
// import MarkdownEditor from '@/components/MarkdownEditor/index.vue'
export default {
  components: { Tinymce,Upload },
  // components: { MarkdownEditor },
  data() {
    return {
      days:"",
      nights:"",
      dialogVisible:false,
      content:"",
      content2:"",
       shopDate:[],
       projectName:"",
       projectTitle:"",
       projectDetail:"",
       projectPhone:"",
       inventory:"",
       playDetail:"",
       checkListBase:[],
       checkListBaseList:[],
       checkListBase2:[],
       checkListEat:[],
       checkListPlay:[],
       options: [],
       value: '',
       id:this.$route.params.id,
       //新建商品需要传给后台字段
        "availableDateBegin": "2020-02-02",//可用日期开始 
        "availableDateEnd": "2020-02-20",//可用日期结束 
        "desc": "string",  // 图文描述
        "merchPic": [    //商品图片
          {
            "bucket": "string",
            "fileKey": "string",
            "name": "string"
          }
        ],
        "payNotice": "string",  //购买须知 
        "price": 0,   //商品价格 
        "projectId": 0,  //所属项目id 
        "sales": [   //优惠类型(枚举值) ,
          0
        ],
        "subtitle": "string",  //商品副标题
        "title": "string",    //商品标题
        "travelRoute": "string",  //行程路线
        fileOtherPic:[],
        posi:this.$route.query.posi,
    }
  },
  created() {
     //findByOperStatus  //查询所属项目
     api.findByOperStatus({
       operStatus:"0,1",
       pageNo:1,
       pageSize:10000,
     },{
      headers: {
          'Content-Type': 'application/json;charset=UTF-8'
      }
    }).then(json => {
      if(json){
           this.options=json.list;
               //查询优惠枚举值
              api.enumsAll({},{
                headers: {
                    'Content-Type': 'application/json;charset=UTF-8'
                }
              }).then(json => {
                if(json){
                    this.checkListBaseList=json.merchSaleType;
                    this.$nextTick(()=>{
                       let elementList = document.querySelectorAll(".projectNameSelect");
                       elementList[0].style.width=elementList[0].style.minWidth;
                      //  console.log(elementList[0].style.minWidth);
                    });
                    if(this.id!=0){  //编辑  
                        //merchDetail  查商品的详情接口
                        api.merchDetail({
                        },this.id,{
                          headers: {
                              'Content-Type': 'application/json;charset=UTF-8'
                          }
                        }).then(json => {
                          if(json){
                                this.projectName=json.projectId; //所属项目id
                                this.projectTitle=json.title;//商品标题
                                this.projectDetail=json.subtitle;  //商品副标题
                                this.fileOtherPic=json.merchPic;//商品图片
                                this.content=json.travelRoute;  //行程路线
                                this.content2=json.desc;  //图文描述
                                this.playDetail=json.payNotice;//购买须知

                                // this.shopDate
                                this.shopDate=[];
                                this.shopDate.push(json.availableDateBegin);
                                this.shopDate.push(json.availableDateEnd);
                                // console.log(this.shopDate,7777777);
                                // this.availableDateBegin = FormatDate(new Date(Number(shopDate[0])),'yyyy-MM-dd'); //开始日期
                                // this.availableDateEnd = FormatDate(new Date(Number(shopDate[1])),'yyyy-MM-dd');  //结束日期
                                this.projectPhone=json.price;//商品价格
                                this.inventory=json.inventory;
                                this.days=json.days;
                                this.nights=json.nights;
                                // this.checkListBase=json.sales;//优惠
                                if(json.sales.length==0){
                                    this.checkListBase=json.sales;
                                }else {
                                  this.checkListBase=[];
                                    for(let i in this.checkListBaseList){
                                      for(let j in json.sales){
                                          if(this.checkListBaseList[i].code==json.sales[j]){
                                              this.checkListBase.push(this.checkListBaseList[i].desc);
                                          }
                                      } 
                                    }
                                }
                                this.$nextTick(()=>{
                                      if(this.posi==2){
                                           this.$refs.projectPhone.focus();
                                      }
                                      if(this.posi==2||this.posi==3){
                                          window.scrollTo(0,100000);
                                      }
                                });
                             
                          }
                        })
                    }
              }
          })
        }
      });
   





  },
  computed: {
    language() {
      return this.languageTypeList['en']
    }
  },
　mounted() {
     if(this.id==0){
         document.title = "新建商品 - 阅阳旅居";
      }else {
          document.title = "编辑商品 - 阅阳旅居";
      }
    
},
methods: {
  sumitBtnFalse(){
    this.dialogVisible=true;
  },
  //点击弹框中的确定按钮
  sureBtn(){
      this.$router.push({
        path:'/project/shopList',
        name:'shopList',
      })
  },
  uploadChange(fileInfo,type){
    if(type == -1){
        this.fileOtherPic.splice(fileInfo,1);
    }else{//项目图片
        this.fileOtherPic.push(fileInfo);
    }
  },
  //点击提交按钮
  addProjectData(){
      //提交时的校验
      if(this.sumitCheck() ==false){
        return false;
      }
      this.changeBaseEatPlay(); //获取选择的数据传给后台
      this.projectId=this.projectName-0; //所属项目id
      this.title=this.projectTitle;//商品标题
      this.subtitle=this.projectDetail;  //商品副标题
      this.merchPic=this.fileOtherPic;//商品图片
      this.travelRoute=this.content;  //行程路线
      this.desc=this.content2;  //图文描述
      this.payNotice=this.playDetail;//购买须知
      let shopDate=[];
      for(let i in this.shopDate){
          var r = /^\+?[1-9][0-9]*$/;　　//正整数
          if(r.test(this.shopDate[i])){
            shopDate.push(this.shopDate[i]);
          }else {
            shopDate.push(this.shopDate[i].getTime());
          }
      }
      if(shopDate[0]-shopDate[1]>0){
            this.availableDateBegin = FormatDate(new Date(Number(shopDate[1])),'yyyy-MM-dd'); //开始日期
            this.availableDateEnd = FormatDate(new Date(Number(shopDate[0])),'yyyy-MM-dd');  //结束日期
      }else {
          this.availableDateBegin = FormatDate(new Date(Number(shopDate[0])),'yyyy-MM-dd'); //开始日期
          this.availableDateEnd = FormatDate(new Date(Number(shopDate[1])),'yyyy-MM-dd');  //结束日期
      }

      console.log(this.availableDateBegin,this.availableDateEnd,999999999);
      this.price=this.projectPhone-0;//商品价格

      this.sales=this.checkListBase2;//优惠
      if(this.id==0){  //编辑
          //shopAdd 新建商品接口
          api.shopAdd({
            availableDateBegin: this.availableDateBegin,
            availableDateEnd:this.availableDateEnd,
            desc: this.desc,
            merchPic: this.merchPic,
            payNotice:this.payNotice,
            price: this.price,
            projectId: this.projectId,
            sales: this.sales,
            subtitle: this.subtitle,
            title: this.title,
            travelRoute: this.travelRoute,
            inventory:this.inventory,
            days:this.days,
            nights:this.nights
          },{
            headers: {
                'Content-Type': 'application/json;charset=UTF-8'
            }
          }).then(json => {
              this.$message({
                message: "新建商品成功",
                type: "success",
              });
              // console.log(json,888);
              setTimeout(()=>{
                   this.$router.push({
                      path:'/project/detailShop',
                      name:'detailShop',
                       params: {
                          id: json
                        }
                    })
              },1000)
          });
      }else {  //编辑
          api.shopEdit({
            availableDateBegin: this.availableDateBegin,
            availableDateEnd:this.availableDateEnd,
            desc: this.desc,
            id:this.id,
            merchPic: this.merchPic,
            payNotice:this.payNotice,
            price: this.price,
            projectId: this.projectId,
            sales: this.sales,
            subtitle: this.subtitle,
            title: this.title,
            travelRoute: this.travelRoute,
            inventory:this.inventory,
            days:this.days,
            nights:this.nights
          },{
            headers: {
                'Content-Type': 'application/json;charset=UTF-8'
            }
          }).then(json => {
              this.$message({
                message: "编辑商品成功",
                type: "success",
              });
              setTimeout(()=>{
                    this.$router.push({
                      path:'/project/detailShop',
                      name:'detailShop',
                    })
              },1000)
          });
      }
  
      },
      //提交的时候获取配套设施需要提交给后台的数据
        changeBaseEatPlay(){
            this.checkListBase2=[];
            for(let i in this.checkListBase){
              for(let j in this.checkListBaseList){
                  if(this.checkListBase[i]==this.checkListBaseList[j].desc){
                        this.checkListBase2.push(this.checkListBaseList[j].code);
                  }
              } 
            }
            // console.log(this.checkListBase2);
        },
      //校验
      sumitCheck(){
          //projectName  所属项目
          if(this.projectName==""){
              this.$message({
                    message: "请选择所属项目",
                    type: "error",
                });
                return false;
            }
            //projectTitle 商品标题
            if(this.projectTitle==""){
              this.$message({
                    message: "商品标题不能为空",
                    type: "error",
                });
                return false;
            }
            //projectDetail 商品副标题
            if(this.projectDetail==""){
              this.$message({
                    message: "商品副标题不能为空",
                    type: "error",
                });
                return false;
            }
            //商品图片  this.fileOtherPic
            if(this.fileOtherPic==""){
              this.$message({
                    message: "商品图片至少上传一张",
                    type: "error",
                });
                return false;
            }
            //行程路线 content
          if(this.content==""){
              this.$message({
                    message: "行程路线不能为空",
                    type: "error",
                });
                return false;
            }
            //图文描述 content2
          if(this.content2==""){
              this.$message({
                    message: "图文描述不能为空",
                    type: "error",
                });
                return false;
            }
            //购买须知 playDetail
            if(this.playDetail==""){
              this.$message({
                    message: "购买须知不能为空",
                    type: "error",
                });
                return false;
            }
            // 可出行日期this.shopDate
            if(this.shopDate==null||this.shopDate.length==0){
              this.$message({
                    message: "可出行日期不能为空",
                    type: "error",
                });
                return false;
            }
            
            //days 出行天数
            if(this.days==0){
              this.$message({
                    message: "出行天数多少天不能为空",
                    type: "error",
                });
                return false;
            }
             //nights 出行天数
            if(this.nights==0){
              this.$message({
                    message: "出行天数多少晚不能为空",
                    type: "error",
                });
                return false;
            }
            //inventory 单天库存
            if(this.inventory==0||this.inventory==''){
              this.$message({
                    message: "单天库存不能为空",
                    type: "error",
                });
                return false;
            }
          
            
            //projectPhone 商品价格
            if(this.projectPhone==0){
              this.$message({
                    message: "商品价格不能为空",
                    type: "error",
                });
                return false;
            }
           
            
            //优惠 
            // console.log(this.checkListBase,"优惠");
            // if(this.checkListBase.length==0){
            //   this.$message({
            //         message: "优惠至少选择一项",
            //         type: "error",
            //     });
            //     return false;
            // }
      },
      //商品副标题20-150
      projectDetailChange(){
          if(this.projectDetail!=""){
              if(this.projectDetail.length-20<0||this.projectDetail.length-150>0){
                  this.$message({
                      message: "商品副标题必须20~150个字",
                      type: "error",
                  });
                  this.$refs.projectDetailRef.focus();
              }
          }
      },
      //商品标题最多20个字
      projectTitleChange(){
          if(this.projectTitle.length-20>0){
              this.$message({
                  message: "商品标题最多20个字",
                  type: "error",
              });
              this.$refs.projectTitleRef.focus();
          }
      },
      //MarkdownEditor获取编辑器的html
      // getHtml() {
      //   this.html = this.$refs.markdownEditor.getHtml()
      //   console.log(this.html,123456)
      // },
      keydown(event) {
        if (event.shiftKey || event.key == "Process") {
          event.returnValue = false;
          return false;
        }
        if (
          !(event.keyCode == 46) &&
          !(event.keyCode == 8) &&
          !(event.keyCode == 37) &&
          !(event.keyCode == 39) &&
          !(event.keyCode == 110) &&
          !(event.keyCode == 190)
        ) {
          if (
            !(
              (event.keyCode >= 48 && event.keyCode <= 57) ||
              (event.keyCode >= 96 && event.keyCode <= 105)
            )
          ) {
            event.returnValue = false;
          }
        }
      },
      proving1() {
        let score = (this.projectPhone || "").toString();
        let value = score.match(/^\d*(\.?\d{0,1})/g)[0] || "";
        if (value == ".") {
          value = "";
        }
        if(value.indexOf(".")!=-1){
          value = value.substr(0, value.indexOf("."));
        }
        this.projectPhone = value;
      },
      oninput1() {
        let score = (this.projectPhone || "").toString();
        let value = score.match(/^\d*(\.?\d{0,1})/g)[0] || "";
        if(value.indexOf(".")!=-1){
          value = value.substr(0, value.indexOf("."));
        }
        
        if (value == ".") {
          value = "";
        }
        this.projectPhone = value;
      },
      proving2() {
        let score = (this.inventory || "").toString();
        let value = score.match(/^\d*(\.?\d{0,1})/g)[0] || "";
        if (value == ".") {
          value = "";
        }
        if(value.indexOf(".")!=-1){
          value = value.substr(0, value.indexOf("."));
        }
        if(value.length>=5){
           value = "9999";
        }
        this.inventory = value;
      },
      oninput2() {
        let score = (this.inventory || "").toString();
        let value = score.match(/^\d*(\.?\d{0,1})/g)[0] || "";
        if(value.indexOf(".")!=-1){
          value = value.substr(0, value.indexOf("."));
        }
        
        if (value == ".") {
          value = "";
        }
        if(value.length>=5){
           value = "9999";
        }
        this.inventory = value;
      },
      proving3() {
        let score = (this.days || "").toString();
        let value = score.match(/^\d*(\.?\d{0,1})/g)[0] || "";
        if (value == ".") {
          value = "";
        }
        if (value-0>100) {
          value = 100+"";
        }
        if(value.indexOf(".")!=-1){
          value = value.substr(0, value.indexOf("."));
        }
        this.days = value;
      },
      oninput3() {
        let score = (this.days || "").toString();
        let value = score.match(/^\d*(\.?\d{0,1})/g)[0] || "";
        if(value.indexOf(".")!=-1){
          value = value.substr(0, value.indexOf("."));
        }
        if (value-0>100) {
          value = 100+"";
        }
        if (value == ".") {
          value = "";
        }
        this.days = value;
      },
      proving4() {
        let score = (this.nights || "").toString();
        let value = score.match(/^\d*(\.?\d{0,1})/g)[0] || "";
        if (value == ".") {
          value = "";
        }
        if (value-0>100) {
          value = 100+"";
        }
        if(value.indexOf(".")!=-1){
          value = value.substr(0, value.indexOf("."));
        }
        this.nights = value;
      },
      oninput4() {
        let score = (this.nights || "").toString();
        let value = score.match(/^\d*(\.?\d{0,1})/g)[0] || "";
        if(value.indexOf(".")!=-1){
          value = value.substr(0, value.indexOf("."));
        }
        if (value-0>100) {
          value = 100+"";
        }
        if (value == ".") {
          value = "";
        }
        this.nights = value;
      },
    }
  }
</script>
<style lang="scss">
.el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li {
  background-color: #fff;
}

.textareaShop .el-textarea__inner{ 
  resize: none;
  height: 100px;
}
.textarea .el-textarea__inner{ 
  resize: none;
  height: 150px;
}
.mce-menubar .mce-menubtn  {
  display: none;
}
.projectNameSelect .el-select-dropdown__item {
   overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
}
.app-container .el-form-item.is-success .el-input__inner,.app-container  .el-form-item.is-success .el-textarea__inner{
  border: 1px solid #DDDDDD !important;
  background-color: #fff !important;
  background: #fff !important;
}
.app-container .el-form-item.is-success .el-input__inner:focus,.app-container .el-form-item.is-success .el-textarea__inner:focus,.app-container .el-input.is-active .el-input__inner,.app-container .el-input__inner:focus {
  border: 1px solid #FF6A00 !important;
  border-color:#FF6A00 !important;
      background-color: #fff !important;
    background: #fff !important;
}
.el-checkbox__input.is-checked .el-checkbox__inner, .el-checkbox__input.is-indeterminate .el-checkbox__inner {
  background-color:#FC612A !important;
  border-color:#FC612A !important;
}
.el-checkbox__input.is-checked+.el-checkbox__label,.el-textarea__inner:focus,.el-textarea__inner:focus {
  color:#FC612A !important;
}
.mce-container, .mce-container *, .mce-widget, .mce-widget *, .mce-reset {
      vertical-align: bottom !important;
}
.addProjectApp {
  .el-breadcrumb{
    height:52px;
    line-height:52px;
  }
}
.projectNameSelectInput .el-input__inner {
  height:40px;
  line-height: 40px;
}
</style>
<style lang="scss" scoped>
  .app-container {
    padding:16px 24px 35px;
  }
    .addProjectApp {
     .type {
         padding:0px 30px 10px 0px;border-bottom:1px solid #E5E7EB;height:52px;line-height:52px;
     }
  }
  .header {
       width: 100%;
      border-radius:4px;
      background: #fff;
      // padding:0px 20px;
      box-sizing: border-box;
      .parts {
         padding:15px 20px;
         box-sizing: border-box;
        //  background: #f2f2f2;
        background: #F4F5F8;
         margin-top:30px;
        //  font-weight: 700;
        font-size: 14px;
        color: #262626;
        position: relative;
        .border {
          width:3px;
          height:20px;
          background: #FC612A;
          position: absolute;
          top:13px;
          left:0;
          z-index:5;
        }
      }
      .partsSec {
        margin-top:0px;
      }
      .nav {
        padding:10px 20px;
        box-sizing: border-box;
      }
      .navList {
          padding:10px 0;
          box-sizing: border-box;
          .h5,.input,.numberP {
            float: left;
          }
          .h5 {
            width:100px;
            height: 40px;
            line-height: 40px;
            font-size: 14px;
            color: #262626;
            font-weight:normal;
            img {
              // width:14px;
              margin-top:13px;
              margin-right:10px;
            }
            svg {
               margin-top:13px;
              margin-right:10px;
            }
            span {
              font-size: 14px;
              color: #262626;
            }
          }
          .input {
            width:80%;
          }
          .dateShop {
            width:40%;
          }
          .numberP {
            line-height: 40px;
            margin-left:10px;
            font-weight: 700;
          }
          .numberShop {
            width:40%;
          }
          .numberShopDate {
            float: left;
            width:200px;
          }
          .numberShopDateFont {
            float: left;
            line-height:40px;
            margin:0 15px;
          }
          .uploadDetail {
            float: left;
             .upload {
               width:150px;
               height: 115px;
               border: 1px solid #DCDFE6;
               border-radius: 4px;
               text-align: center;
               line-height: 115px;
               color: #ccc;
               cursor: pointer;
             }
             p {
               margin-top:20px;
               color: #ccc;
               font-size:14px;
             }
          }
          .checkDetail {
            float: left;
            width:80%;
            background: #F7F7F9;
            border-radius: 2px;
            padding:8px 20px 20px;
            box-sizing: border-box;
            .checkListAll {
              margin-top:20px;
              span {
                float: left;
                font-size: 14px;
                color: #262626;
              }
              .checkList {
                float: left;
                margin-left:20px;
              }
            }
            .checkListAll:first-child{
                 margin-top:12px;
            }
          }
      }
  }
    .sumitAdd {
    padding:50px 50px 30px 0;
    box-sizing: border-box;
    .sumitBtn {
      float: left;
      width:180px;
      height: 50px;
      border:1px solid #DCDFE6;
      border-radius: 5px;
      -webkit-border-radius: 5px;
      text-align: center;
      line-height: 50px;
      margin-left:30px;
      cursor: pointer;
    }
    .setData {
      background: #FC612A;
      color: #fff;
      border:1px solid #FC612A;
      margin-left:360px;
    }
  }
  .uploadFontFont {
    float: left;
    height:40px;
    margin-left:10px;
    position: relative;
    p {
       font-size: 12px;
       color: #A9A9A9;
    }
    .xing {
      position: absolute;
      left:0;
      top:0;
      font-size: 16px;
      color: #F52D2D;
    }
    svg {
      position: absolute;
      top:10px;
    }
  }
</style>